<template>
  <div class="setting-header">
    <div class="">
      <slot name="title">{{ title }}</slot>
    </div>
    <div>
      <slot name="operate" :data="data"></slot>
    </div>
  </div>
</template>

<script setup>
const props = defineProps({
  title: String,
  data: {
    type: Object,
    default: () => {},
  },
})
</script>

<style lang="scss" scoped>
.setting-header {
  width: 100%;
  @include use-flex(center, space-between);
  font-size: 18px;
  font-weight: 700;
  color: #2e3033;
  line-height: 27px;
  padding-bottom: 20px;
  border-bottom: 1px solid #dcdfe6;
}
</style>
